import React, { FC, useEffect } from 'react'
import { View, Text, ScrollView } from 'react-native'
import { useNavigation } from '@react-navigation/native'
import list from '../../../store/list'

import MySwiper from './MySwiper'
import SearchBar from '../../../components/search/SearchBar'
import HotCate from './HotCate'
import Top10 from './Top10'

import styles from './styleCookbook'

import { observer } from 'mobx-react'

type Props = {
}

const Cookbook:FC<Props> = (props) => {
  useEffect(() => {
    list.setList()
  }, [])

  return (
    <ScrollView style={styles.container}>
      <MySwiper></MySwiper>
      <SearchBar></SearchBar>
      <HotCate></HotCate>
      <Top10></Top10>
    </ScrollView>
  )
}

export default observer(Cookbook)
